<?php

/**
 * @Author: Wang Chunsheng 2192138785@qq.com
 * @Date:   2020-03-01 20:56:37
 * @Last Modified by:   Wang chunsheng  email:2192138785@qq.com
 * @Last Modified time: 2020-06-04 12:26:26
 */
use common\addons\diandi_shop\models\GoodsLabel;
use yii\helpers\ArrayHelper;
use common\widgets\adminlte\VueJsAsset;
use richardfan\widget\JSRegister;
use yii\helpers\Url;

$store_id = Yii::$app->params['store_id'];
VueJsAsset::register($this);
?>

<div class="dd-goods-form" id="dd-goods-form">



    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
        <?= $form->field($model, 'goods_name')->textInput(['maxlength' => true]); ?>

        <!--一级目录--> <?= $form->field($model, 'category_pid')->dropDownList($Helper->courseCateMap(), [
                        'prompt' => ['text' => '一级分类', 'options' => ['value' => 0]],
                        'label' => '一级分类',
                        'id' => 'classsearch-cocate_id',
                    ])->label('一级分类'); ?>
        <?= $form->field($model, 'goods_price')->textInput(); ?>
        <?= $form->field($model, 'stock')->textInput(); ?>
        <?= $form->field($model, 'thumb')->widget('common\widgets\webuploader\FileInput', [])->hint('尺寸：500px*500px')->label('商品主图'); ?>

        <?= $form->field($model, 'goods_status')->radioList([
            '1' => '上架',
            '0' => '下架',
        ], ['style' => 'padding-top:7px;']); ?>
        <?= $form->field($model, 'deduct_stock_type')->radioList([
            '10' => '下单减库存',
            '20' => '支付减库存',
        ], ['style' => 'padding-top:7px;']); ?>
        <?= $form->field($model, 'goods_weight')->textInput(); ?>
        
        <?= $form->field($model, 'label')->radioList(ArrayHelper::map(
            GoodsLabel::find()->where(['store_id' => $store_id])->all(),
            'label',
            'label'
        )); ?>
    </div>

    <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
        <?= $form->field($model, 'goods_sort')->textInput(); ?>

        <!--二级目录--><?= $form->field($model, 'category_id')->dropDownList($Helper->courseMap($model->category_id), [
                        // 'options' => ['5' => ['selected' => true]],
                        'prompt' => ['text' => '二级分类', 'options' => ['value' => 0]],

                        'id' => 'classsearch-course_id',
                    ])->label('二级分类 '); ?>
        <?= $form->field($model, 'line_price')->textInput(); ?>
        <?= $form->field($model, 'sales_initial')->textInput(); ?>


        <?= $form->field($model, 'images')->widget('common\widgets\webuploader\FileInput', ['clientOptions' => [
            'pick' => [
                'multiple' => true,
            ],
        ]])->hint('尺寸：375px*500px')->label('商品相册'); ?>


        <?= $form->field($model, 'video')->textInput([
        'v-model' => 'pathurl',
        ])->label('商品视频'); ?>
   
       
        <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" alt="">
        </el-dialog>
        <el-upload class="avatar-uploader"
                        action="<?= Url::to(['/upload/upload/uploadfile']); ?>"
                        v-bind:data="{'field':'DdGoods[video]','path':'goods'}"
                        v-bind:name="'DdGoods[video]'"
                        list-type="picture-card"
                        v-bind:auto-upload="true"
                           v-bind:on-success="handleVideoSuccess"
                           v-bind:before-upload="beforeUploadVideo"
                           v-bind:show-file-list="false">
                        <video v-if="videoForm.showVideoPath !='' && !videoFlag"
                           v-bind:src="videoForm.showVideoPath"
                           class="avatar video-avatar"
                           controls="controls"
                           width="100%"
                           height="100%"
                        >
                        您的浏览器不支持视频播放
                    </video>
                    
                    <i class="el-icon-plus" v-if="videoForm.showVideoPath ==''"></i>

                </el-upload> 
    </div>
</div>

<?php JSRegister::begin([
    'key' => 'vue',
]); ?>
<script>
new Vue({
      el: '#dd-goods-form',
      data: function() {
        return { 
            videoFlag: false,
            //是否显示进度条
            videoUploadPercent: "",
            //进度条的进度，
            isShowUploadVideo: false,
            //显示上传按钮
            videoForm: {
                showVideoPath: "<?= '/attachment/'.$model['video']; ?>"
            },
            pathurl:"<?= $model['video']; ?>"
        }
         
      },
      methods: {
            //上传前回调
            beforeUploadVideo(file) {
                var fileSize = file.size / 1024 / 1024 < 50;
                if (['video/mp4', 'video/ogg', 'video/flv', 'video/avi', 'video/wmv', 'video/rmvb', 'video/mov'].indexOf(file.type) == -1) {
                    layer.msg("请上传正确的视频格式");
                    return false;
                }
                if (!fileSize) {
                    layer.msg("视频大小不能超过50MB");
                    return false;
                }
                this.isShowUploadVideo = false;
            },
            //上传成功回调
            handleVideoSuccess(res, file) {
                this.isShowUploadVideo = true;
                this.videoFlag = false;
                this.videoUploadPercent = 0;
                //前台上传地址
                //if (file.status == 'success' ) {
                //    this.videoForm.showVideoPath = file.url;
                //} else {
                //     layer.msg("上传失败，请重新上传");
                //}
                    
                //后台上传地址
                if (res.file_path) {
                    this.pathurl = res.file_path
                    this.videoForm.showVideoPath =  "/attachment/"+res.file_path;
                } else {
                    console.log('上传失败')
                }
            },
        handlePreview(file){
            console.log(file)
        },
        handleRemove(file) {
            console.log(file);
        },
        handlePictureCardPreview(file) {
            this.dialogImageUrl = file.url;
            this.dialogVisible = true;
        },
        handleDownload(file) {
            console.log(file);
        },
        uploadsuccess(response, file, fileList){
            this.pathurl = response.file_path
            console.log(response, file, fileList);
            
        }
    }
})
    
</script>
<?php JSRegister::end(); ?>    